<!-- 启动页 -->
<template>
<div>
    <img src="/static/img/loading.png" class="start-img">
    
    <!-- 弹窗 -->
    <view :class="['cu-modal', isShowModal ? 'show' : '']">
        <view class="cu-dialog">
            <view class="cu-bar justify-end">
                <view class='content'>登陆授权</view>
            </view>
            <view class='padding-xl'>
                为了确保您正常使用芝麻优聘，请授权用户信息（头像、昵称）
            </view>
            <view class="cu-bar">
                <button 
                class='action margin-0 flex-sub text-green solid-left' 
                open-type="getUserInfo" 
                @getuserinfo="getUserInfoHandle"
            >去授权</button>
            </view>
        </view>
    </view>

</div>

    <!-- <div class="start-img"></div> -->
</template>

<script>
import store from '@/store';
import {
    getUserOpenId
} from './model/result.model';

export default {
    data () {
        return {
            isShowModal: false
        };
    },
    onReady () {
        // 调用登录接口
        wx.login({
            success: (loginRes) => { // 获取用户openid
                // console.log(loginRes)
                if(loginRes.code) { // 登陆成功，获取了用户openid加密数据
                    // 发送给服务端获取真正端openid
                    getUserOpenId({
                        openId: loginRes.code
                    }).then((result)=>{
                        if(result.data) { // 已记录了openid
                            wx.getUserInfo({
                                // withCredentials: true,
                                success: (res) => {
                                    if(res.userInfo) {
                                        store.commit('setUserInfoFromWx', res.userInfo);
                                        this.isShowModal = false;
                                        wx.switchTab({
                                            url: '/pages/list/main'
                                        })
                                    }
                                },
                                fail: (res) => {
                                    this.isShowModal = true;         
                                }
                            })
                        } else {
                            wx.showToast({
                                title: '登陆失败！',
                                icon: 'none'
                            })
                        }
                    })
                        
                } else {
                    wx.showToast({
                        title: '登陆失败！\r\n请重试',
                        icon: 'none'
                    })
                }
                
            }
        })
    },
    watch: {
        '$store.state.userInfoFromWx': {
            handler() {
                if(Object.keys(this.$store.state.userInfoFromWx).length !==0 ) {
                    this.isShowModal = false;
                    wx.switchTab({
                        url: '/pages/list/main'
                    })
                }
            },
            immediate: true      
        }
    },
    methods: {
        getUserInfoHandle(e) {
            store.commit('setUserInfoFromWx', e.target.userInfo);
        }
    }
}

</script>
<style lang='less' scoped>
.start-img {
    width: 100%;
    height: 100vh;
}
</style>